// $primary: #409eff;
// $success: #409eff;
// $warning: #409eff;
// $danger: #409eff;
// $info: #ccc;
// $text: #333;
// $field: #666;
// $info: #999;

$--color-primary: #409eff;

$--color-success: #e6a23c;
$--color-warning: #e6a23c;
$--color-danger: #f56c6c;
$--color-info: #909399;

$--color-text-primary: #333;
$--color-text-regular: #666;
$--color-text-secondary: #999;
$--color-text-placeholder: #ccc;
$--border-color-base: #fff;

@mixin wh($width: 100%, $height: 100%, $isCenter: false) {
  width: #{$width};
  height: #{$height};
  @if $isCenter {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -($width/2);
    margin-left: -($height/2);
  }
}

// $url, $repeat: no-repeat, $position: center, $size: cover
@mixin img($args) {
  $repeat: map-get($args, repeat);
  $position: map-get($args, position);
  $size: map-get($args, size);
  $url: map-get($args, url);
  @if ($url) {
    background-image: url('~@/static/img/#{$url}');
  }
  background-repeat: if($repeat, $repeat, no-repeat);
  background-position: if($position, $position, center);
  background-size: if($size, $size, cover);
}
@mixin class-mixin($name) {
  .#{$name} {
    @content;
  }
}

@mixin web {
  @include class-mixin(gy) {
    @content;
  }
}

@mixin login {
  @include web {
    @include class-mixin(login) {
      @content;
    }
  }
}
@mixin admin {
  @include web {
    @include class-mixin(admin) {
      @content;
    }
  }
}

$themes: (
  dark: (
    //
      logo-primary: #14161e,
    logo-text: #fff,
    //
      head-primary: #fff,
    head-text: #657180,
    //
      menu-primary: #14161e,
    menu-item: #000,
    // menu-item-hover: #000,
      menu-item-active: #1677ff,
    menu-item-text: #ccc,
    menu-item-text-hover: #fff,
    menu-item-text-active: #fff
  ),
  light: (
    //
      logo-primary: #3c78cd,
    logo-text: #fff,
    //
      head-primary: #fff,
    head-text: #657180,
    //
      menu-primary: #fff,
    menu-item: #fff,
    // menu-item-hover: #fff,
      menu-item-active: #f4fbfe,
    menu-item-text: #657180,
    menu-item-text-hover: #5cadff,
    menu-item-text-active: #2d8cff
  )
);

//主题处理
@mixin theme($name, $style) {
  $el-root: &;
  @each $theme-name, $theme in $themes {
    $theme-color: map-get($theme, $name);
    @each $el in $el-root {
      $theme-class: '.' + $theme-name + $el;
      @at-root {
        #{$theme-class} {
          #{$style}: $theme-color;
        }
      }
    }
  }
}
